import { useStore, moduleActionDispatchMap } from "@/hooks/store/useStore";
import { computed, onUnmounted } from "vue";

/**
 * 返回当前页面 main 区域加载动画状态, 以及 开启&关闭 动画方法
 * @returns 当前状态, 开启&关闭方法
 */
export const useMainLoading = () => {
    const { state, dispatch } = useStore();
    const { layout } = moduleActionDispatchMap;

    /** 当前加载动画状态 */
    const mainLoading = computed(() => state.value.layout.mainLoading.open);

    /**
     * 开启 加载动画
     */
    const openMainLoading = () => {
        dispatch(layout.openMainLoading)
    }

    /**
     * 关闭 加载动画
     */
    const closeMainLoading = () => {
        dispatch(layout.closeMainLoading)
    }

    onUnmounted(() => {
        mainLoading.value && closeMainLoading()
    })

    return {
        mainLoading,
        openMainLoading,
        closeMainLoading
    };
};